import React from 'react';
import { inject, observer } from 'mobx-react';
import { observable, action, toJS } from 'mobx';
import { WeaRightMenu, WeaTop, WeaRadioGroup, WeaEchart, WeaLocaleProvider } from 'ecCom';
import SmsReportEcharts from './SmsReport/SmsReportEcharts';

const getLabel = WeaLocaleProvider.getLabel;
@inject('smsReportStore')
@observer
class SmsReport extends React.Component {
  componentDidMount() {
    const { getCondition, getReportData } = this.props.smsReportStore;
    getCondition();
    getReportData();
  }

  render() {
    let { condition, reportData, getReportData, setState } = this.props.smsReportStore;
    condition = toJS(condition);
    reportData = toJS(reportData);
    return (
      <div className="sms-report">
        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@s42thx`}
          collectParams={{
            favname: getLabel(17009, '短信时间报表'),
            favouritetype: 5,
            objid: 0,
            importantlevel: 1,
          }}
        >
          <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@wn0oj3`}
            title={getLabel(17009, '短信时间报表')}
            icon={<i className="icon-coms-message" />}
            iconBgcolor="#0079de"
            buttonSpace={10}
            showDropIcon={true}
            dropMenuProps={{
              collectParams: {
                favname: getLabel(17009, '短信时间报表'),
                favouritetype: 5,
                objid: 0,
                importantlevel: 1,
              },
            }}
          >
            <div className="sms-report-con">
              <div className="sms-report-condition">
                <WeaRadioGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaRadioGroup@skxe6w`}
                  config={condition}
                  onChange={(params) => {
                    let bool = true;
                    params.timeSag && params.timeSag === '6' && !params.fromdate && !params.enddate && (bool = false);
                    params.orgType && params.orgType === '2' && !params.subid && (bool = false);
                    params.orgType && params.orgType === '3' && !params.depid && (bool = false);
                    params.orgType && params.orgType === '4' && !params.hrmid && (bool = false);
                    bool && getReportData(params);
                    bool && setState({ year: true, resetOptionColor: true });
                  }}
                  beforeInit={
                    (config, lastValueMap, cb) => {
                      cb(lastValueMap);
                    }
                  }
                />
                </div>
                <SmsReportEcharts ecId={`${this && this.props && this.props.ecId || ''}_SmsReportEcharts@sauto9`} reportData={reportData} />
            </div>
          </WeaTop>
        </WeaRightMenu>
      </div>
    );
  }
}

export default SmsReport;
